<template>
  <div class="list">
    <van-cell-group title="我的">
      <van-cell icon="balance-o" title="我的钱包" is-link />
      <div @click="hanledClick">点击跳转</div>
      <van-cell icon="bill-o" title="我的订单" is-link />

      <!-- 优惠券单元格 -->
      <van-coupon-cell
        icon="coupon-o"
        :coupons="coupons"
        :chosen-coupon="chosenCoupon"
        @click="showList = true"
      />
    </van-cell-group>

    <!-- 优惠券列表 -->
    <van-popup v-model="showList" position="bottom">
      <van-coupon-list
        :coupons="coupons"
        :chosen-coupon="chosenCoupon"
        :disabled-coupons="disabledCoupons"
        @change="onChange"
        @exchange="onExchange"
      />
    </van-popup>

    <van-cell-group title="客服">
      <van-cell icon="phone-o" title="联系客服" is-link />
      <van-cell icon="chat-o" title="问题反馈" is-link />
    </van-cell-group>
  </div>
</template>

<script>
const coupon = {
  available: 1,
  condition: "无使用门槛\n最多优惠12元",
  reason: "",
  value: 150,
  name: "优惠券名称",
  startAt: 1489104000,
  endAt: 1514592000,
  valueDesc: "15",
  unitDesc: "元"
};
import axios from "axios";
export default {
  data() {
    return {
      showList: false,
      chosenCoupon: -1,
      coupons: [coupon],
      disabledCoupons: [coupon]
    };
  },
  methods: {
    onChange(index) {
      this.showList = false;
      this.chosenCoupon = index;
    },
    onExchange(code) {
      console.log(code);
      this.coupons.push(coupon);
    },
    hanledClick() {
      console.log(this.$route);

      // this_.$router.push("/");

      axios
        .post("/api/testAll")
        .then(function(response) {
          console.log(response);
          this.$router.push("/aaaa");
          debugger;
        })
        .catch(function(error) {
          console.log(error);
        });
    }
  }
};
</script>

<style lang="stylus" scoped>
@import '~@/assets/styles/varibles.styl';

.list {
  margin-bottom: $footer;
}
</style>
